<template>
  <ul> 
    <li v-for="(item, index) in data" :key="index" @click.stop="handleClick(item)">
      {{item.text}}
      <Tree2 v-if="item.expend" :data="item.children"/>
    </li>
  </ul>
</template>

<script> 
/* 一个组件内部有自己的组件标签 */
export default {  // 
  name: 'Tree2', // 作为内部的标签名
  props: ['data'],

  methods: {
   handleClick (item) {
     if (item.hasOwnProperty('expend')) {
       item.expend = !item.expend
     } else {
       this.$set(item, 'expend', true)
     }
   }
  }
}
</script>